<template>
  <rx-dialog @handOk="okFun"
             :oktext="$ti18('rxForm.ackBtn','确定')"
             @cancel="cancelFun"
             btnalign="center"
             order="bottom"
             style="height: 100%;"
  >
    <rx-layout>
        <div slot="center">
            <a-form :form="form">
              <div class="table-operator">
                <a-button type="primary" icon="plus" @click="addEnt">
                    {{$ti18('rxList.newBtn','新建')}}
                </a-button>
                <a-button type="danger" icon="delete" @click="removeEnt">
                    {{$ti18('rxList.delBtn','删除')}}
                </a-button>
              </div>
                <div style="height: 450px;box-sizing: border-box;padding-bottom: 10px">
                      <rx-grid ref="table"
                        :dataSource="fields"
                        :allowRowSelect="true"
                        :multiSelect="true"
                        :showPage="false"
                        :columns="columns"
                        >
                        <span slot="entId" slot-scope="{text,record,index,blur}">
                          <rx-input-button width="100%" :value="JSON.stringify({value:record.entId,text:record.entName})" @click="onSelectBoEntGrid(text,record,index,blur)"></rx-input-button>
                        </span>
                        <span slot="relateType" slot-scope="{text,record,index,blur}">
                          <a-select v-model="record.relateType" @blur="blur(index,'relateType',text,record)">
                            <a-select-option value="onetoone">
                                {{i18n('list.oneForone','一对一')}}
                            </a-select-option>
                            <a-select-option value="onetomany">
                                 {{i18n('list.onetomany','一对多')}}
                            </a-select-option>
                          </a-select>
                        </span>
                        <span slot="fkField" slot-scope="{text,record,index,blur}">
                          <a-select allowClear v-model="record.fkField" @blur="blur(index,'fkField',text,record)" :options="record.columnList"></a-select>
                        </span>
                        <span slot="pkField" slot-scope="{text,record,index,blur}">
                          <a-select allowClear v-model="record.pkField" @blur="blur(index,'pkField',text,record)" :options="columnList"></a-select>
                        </span>
                      </rx-grid>
                </div>
            </a-form>
      </div>
    </rx-layout>
</rx-dialog>
</template>
<script>
  import FormBoDefApi from '@/api/form/bo/formBoDef'
  import FormDbApi from '@/api/form/bo/formDb'
  import {BaseForm, RxDialog, RxInputButton, RxGrid, Dialog,Util} from "@lowcode/jpaas-common-lib";
  export default {
    name: 'FormBoDefSunEdit',
    mixins:[BaseForm],
    components:{
      RxInputButton,
      RxGrid,Util
    },
    props: {
        mainEntId:{
              type:String,
              default:''
          },
        subEnt: {
              type: Object,
              default: () => {
              }
          },
      },
    data(){
      return {
        subEntObj:{},
        relateTypes:{'onetoone':'一对一','onetomany':'一对多'},
        supportDb:1,
        columnList:[],
        fields:[],
        columns:[
            {title: this.i18n('form.entity','实体'),dataIndex:'entId',allowCellEdit:false,width:120,scopedSlots: {customRender: 'entId'}},
          {title: this.i18n('form.relateType','关系定义'),dataIndex:'relateType',width:120,allowCellEdit:false,scopedSlots: {customRender: 'relateType'}},
          {title: this.i18n('form.sunFkfield','孙实体关联键'),dataIndex:'fkField',width:120,allowCellEdit:false,scopedSlots: {customRender: 'fkField'}},
          {title: this.i18n('form.fkField','子实体关联键'),dataIndex:'pkField',width:120,allowCellEdit:false,scopedSlots: {customRender: 'pkField'}}
          ]
      }
    },
    computed: {
      table() {
        return this.$refs.table;
      },
    },
    methods: {
      i18n(name,text,key){
          return this.$ti18(name,text,"formBoDef",key);
      },
      boentI18n(name,text,key){
          return this.$ti18(name,text,"formBoEntity",key);
      },
      onload_(){
          this.subEntObj= this.subEnt;
          this.columnList=this.subEnt.columnList;
          if(!this.subEntObj.subRelations){
              this.$set(this.subEntObj,"subRelations",[]);
          }else {
              var boRelations=this.subEntObj.subRelations;
              this.fields=boRelations.map(item=>{
                  var record={
                      entId:item.id,
                      entName:item.name,
                      relateType:item.boRelation.type,
                      relateType_name:this.relateTypes[item.boRelation.type],
                      fkField:item.boRelation.fkField,
                      pkField:item.boRelation.pkField
                  }
                  this.getBoEntId(item.id,record);
                  return record;
              });
          }
      },
      okFun(){
          let appId=this.curApp.appId;
          this.subEntObj.subRelations=this.table.getData().map(item=>{
              return {
                  id:item.entId,
                  name:item.entName,
                  boRelation:{
                      parentEntId:this.subEntObj.entId,
                      type:item.relateType,
                      fkField:item.fkField,
                      pkField:item.pkField,
                      appId:appId
                  }
              }
          });
          Util.closeWindow(this,"ok",this.subEntObj)
      },
      cancelFun(values){
            Util.closeWindow(this,"cancel")
      },
      supportDbChange(e){
        if(e.target.checked){
          this.supportDb=1;
        }else{
          this.supportDb=0;
        }
      },
      addEnt(){
        this.table.addRow({});
      },
      removeEnt(){
        this.table.removeRows();
      },
      //选择关联实体
      onSelectBoEntGrid(text,record,index,blur){
        let self=this;
        Dialog.openBoEntDialog({
          curVm: this, widthHeight: ['800px','600px']
        }, function (data) {
            if(self.mainEntId==data.id){
                self.$message.error(this.i18n('msg.noSelectpri',"不能选择主实体！"));
                return;
            }
            if(self.subEntObj.entId==data.id){
                self.$message.error(this.i18n('msg.noSelectCur',"不能选择当前实体！"));
                return;
            }
            //更新
            Object.assign(record,{entId:data.id,entName:data.name});
            self.getBoEntId(data.id,record);
        })
      },
        //获取BO的字段更表
      getBoEntId(id,record){
          let self_=this;
        FormDbApi.getBoEntId(id).then(res=>{
            let columnList=res.columnList.map(item => {
                return { label: item.comment, value: item.fieldName }
            });
            self_.$set(record,"columnList",columnList);

        })
      }
    }
  }
</script>
